<!DOCTYPE html >
<html xmlns:th="http://www.thymeleaf.org">

	<head>
		<meta charset="UTF-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge,Chrome=1">
		<meta name="renderer" content="webkit">
		<title>员工信息</title>
		<!-- 公共样式 开始 -->
		<link rel="stylesheet" type="text/css" href="../../css/base.css">
		<link rel="stylesheet" type="text/css" href="../../fonts/iconfont.css">
		<script type="text/javascript" src="../../framework/jquery-1.11.3.min.js"></script>
		<link rel="stylesheet" type="text/css" href="../../layui/css/layui.css">
		<script type="text/javascript" src="../../layui/layui.js"></script>
		<script src="../../framework/cframe.js"></script><!-- 仅供所有子页面使用 -->
		<!-- 公共样式 结束 -->
		
		<style>
			.layui-form{
				margin-right: 30%;
			}
		</style>

	</head>
<script>

    function condition() {

        $("#condition_mes").toggle()
    }
</script>

	<body>
	<!--添加员工-->
	<hr style="align-content: baseline">
	<a th:href="@{/empl/addBefore}" ><button type="button" class="layui-btn layui-btn-warm" >新员工登记</button></a>
<button type="button" class="layui-btn" onclick="condition()">精确查找</button>
	<!--員工列表-->
	<table class="layui-table">
		<colgroup>
			<col width="150">
			<col width="200">
			<col>
		</colgroup>
		<thead>
		<tr>
			<th>工号</th>
			<th>姓名</th>
			<th>年龄</th>
            <th>性别</th>
            <th>电话</th>
			<th>部门</th>
            <th>职务</th>
            <th>操作</th>

		</tr>
		</thead>
		<tbody>

		<tr th:each="staff:${staffs}">
			<td th:text="${staff.staff_id}"></td>
            <td th:text="${staff.sname}"></td>
            <td th:text="${staff.sage}"></td>
            <td th:text="${staff.ssex}"></td>
            <td th:text="${staff.sphone}"></td>
			<td th:text="${staff.department.dname}"></td>
            <td th:text="${staff.role.role}"></td>
			<td><a th:href="@{/empl/update/}+${staff.staff_id}" ><button type="button" class="layui-btn layui-btn-normal" >修改</button></a>
            <a th:href="@{/empl/del/}+${staff.staff_id}">
                <button type="button" class="layui-btn layui-btn-danger">删除</button>
            </a></td>

		</tbody>
	</table>

	</body>
<!--条件查找-->
<div id="condition_mes" style="display: none">
    <form th:action="@{/empl/condition}">
        <!--账号-->
        <div class="layui-form-item">
            <label class="layui-form-label">账号</label>
            <div class="layui-input-block">
                <input style="width: 200px" type="text" name="saccount" placeholder="请输入账号" autocomplete="off"
                       class="layui-input">
            </div>
        </div>
        <!--姓名-->
        <div class="layui-form-item">
            <label class="layui-form-label">姓名</label>
            <div class="layui-input-block">
                <input style="width: 200px" type="text" name="sname" placeholder="请输入姓名" autocomplete="off"
                       class="layui-input">
            </div>
        </div>
        <!--电话-->
        <div class="layui-inline">
            <label class="layui-form-label">预留电话</label>
            <div class="layui-input-inline">
                <input type="tel" name="sphone" autocomplete="off" class="layui-input">
            </div>
        </div>

        <!--职务-->
        <div class="layui-form-item">
            <label class="layui-form-label">职务</label>
            <div class="layui-input-block">
                <select name="role_id" lay-verify="select1">
                    <option value="">请选择职务</option>
                    <option th:each="role:${roles}" th:value="${role.role_id}" th:text="${role.role}"></option>
                </select>
            </div>
        </div>
        <!--部门-->
        <div class="layui-form-item">
            <label class="layui-form-label">所属部门</label>
            <div class="layui-input-block">
                <select name="department_id" lay-verify="select2">
                    <option value="">请选择部门</option>
                    <option th:each="dep:${departments}" th:value="${dep.department_id}"
                            th:text="${dep.dname}"></option>
                </select>
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-input-block">
                <button class="layui-btn " lay-submit lay-filter="form">查找</button>
                <button type="reset" class="layui-btn layui-btn-primary">重置</button>
            </div>
        </div>
    </form>
</div>

</html>